<template>
  <div class="tableOut">
    <el-table :data="auditData" :height="tabH" :style="{ height: tabH }" width="100%" stripe :header-cell-style="{ background: '#F9F9F9', color: '#909399' }">
      <el-table-column prop="audit_no" label="审核编号" width="250" />
      <el-table-column prop="type_name" label="审核类型" width="200"> </el-table-column>
      <el-table-column prop="state_name" label="审核结果" width="200" />
      <el-table-column prop="remark" label="原因" width="200" />
      <el-table-column prop="audit_uid_name" label="审核人" width="200" />
      <el-table-column prop="created_at" label="审核时间" min-width="180" />
      <template #empty>
        <div class="empty">
          <img class="emty_img" src="@/assets/noData.png" alt="" />
          <div class="emty_title">暂无数据</div>
        </div>
      </template>
    </el-table>
  </div>
</template>
<script lang="ts" setup>
  import { reactive, ref, watch, defineExpose, withDefaults, defineProps, onMounted } from 'vue'
  import {tableH, reSize} from '@/utils/utils'
  interface Props {
    auditData: any
  }
  withDefaults(defineProps<Props>(), {
    auditData: () => {}
  })
  const tabH = ref('500px')
  const getTableH = () => {
    const h = parseInt(tableH('.tableOut'))
    tabH.value = h - 280 + 'px'
  }
  onMounted(() => {
    getTableH()
    reSize(getTableH)
  })
</script>

<style lang="scss" scoped>
  .empty {
    padding: 100px 0;
    .emty_img {
      transform: translateX(15%);
    }
  }
</style>
